home *** CD-ROM | disk | FTP | other *** search
/ PC World 2008 February (DVD) / PCWorld_2008-02_DVD.iso / v cisle / PHP / PHP.exe / EasyPHP-2.0b1-setup.exe / {app} / sqlitemanager / jscalendar / calendar-blue2.css < prev    next >
Encoding:
Cascading Style Sheet File  |  2006-04-18  |  4.9 KB  |  237 lines
  1. /* The main calendar widget.  DIV containing a table. */
  2.  
  3. div.calendar { position: relative; }
  4.  
  5. .calendar, .calendar table {
  6.   border: 1px solid #206A9B;
  7.   font-size: 11px;
  8.   color: #000;
  9.   cursor: default;
  10.   background: #F1F8FC;
  11.   font-family: tahoma,verdana,sans-serif;
  12. }
  13.  
  14. /* Header part -- contains navigation buttons and day names. */
  15.  
  16. .calendar .button { /* "<<", "<", ">", ">>" buttons have this class */
  17.   text-align: center;    /* They are the navigation buttons */
  18.   padding: 2px;          /* Make the buttons seem like they're pressing */
  19. }
  20.  
  21. .calendar .nav {
  22.   background: #007ED1 url(menuarrow2.gif) no-repeat 100% 100%;
  23. }
  24.  
  25. .calendar thead .title { /* This holds the current "month, year" */
  26.   font-weight: bold;      /* Pressing it will take you to the current date */
  27.   text-align: center;
  28.   background: #000;
  29.   color: #fff;
  30.   padding: 2px;
  31. }
  32.  
  33. .calendar thead tr { /* Row <TR> containing navigation buttons */
  34.   background: #007ED1;
  35.   color: #fff;
  36. }
  37.  
  38. .calendar thead .daynames { /* Row <TR> containing the day names */
  39.   background: #C7E1F3;
  40. }
  41.  
  42. .calendar thead .name { /* Cells <TD> containing the day names */
  43.   border-bottom: 1px solid #206A9B;
  44.   padding: 2px;
  45.   text-align: center;
  46.   color: #000;
  47. }
  48.  
  49. .calendar thead .weekend { /* How a weekend day name shows in header */
  50.   color: #a66;
  51. }
  52.  
  53. .calendar thead .hilite { /* How do the buttons in header appear when hover */
  54.   background-color: #34ABFA;
  55.   color: #000;
  56.   border: 1px solid #016DC5;
  57.   padding: 1px;
  58. }
  59.  
  60. .calendar thead .active { /* Active (pressed) buttons in header */
  61.   background-color: #006AA9;
  62.   border: 1px solid #008AFF;
  63.   padding: 2px 0px 0px 2px;
  64. }
  65.  
  66. /* The body part -- contains all the days in month. */
  67.  
  68. .calendar tbody .day { /* Cells <TD> containing month days dates */
  69.   width: 2em;
  70.   color: #456;
  71.   text-align: right;
  72.   padding: 2px 4px 2px 2px;
  73. }
  74. .calendar tbody .day.othermonth {
  75.   font-size: 80%;
  76.   color: #bbb;
  77. }
  78. .calendar tbody .day.othermonth.oweekend {
  79.   color: #fbb;
  80. }
  81.  
  82. .calendar table .wn {
  83.   padding: 2px 3px 2px 2px;
  84.   border-right: 1px solid #000;
  85.   background: #C7E1F3;
  86. }
  87.  
  88. .calendar tbody .rowhilite td {
  89.   background: #def;
  90. }
  91.  
  92. .calendar tbody .rowhilite td.wn {
  93.   background: #F1F8FC;
  94. }
  95.  
  96. .calendar tbody td.hilite { /* Hovered cells <TD> */
  97.   background: #def;
  98.   padding: 1px 3px 1px 1px;
  99.   border: 1px solid #8FC4E8;
  100. }
  101.  
  102. .calendar tbody td.active { /* Active (pressed) cells <TD> */
  103.   background: #cde;
  104.   padding: 2px 2px 0px 2px;
  105. }
  106.  
  107. .calendar tbody td.selected { /* Cell showing today date */
  108.   font-weight: bold;
  109.   border: 1px solid #000;
  110.   padding: 1px 3px 1px 1px;
  111.   background: #fff;
  112.   color: #000;
  113. }
  114.  
  115. .calendar tbody td.weekend { /* Cells showing weekend days */
  116.   color: #a66;
  117. }
  118.  
  119. .calendar tbody td.today { /* Cell showing selected date */
  120.   font-weight: bold;
  121.   color: #D50000;
  122. }
  123.  
  124. .calendar tbody .disabled { color: #999; }
  125.  
  126. .calendar tbody .emptycell { /* Empty cells (the best is to hide them) */
  127.   visibility: hidden;
  128. }
  129.  
  130. .calendar tbody .emptyrow { /* Empty row (some months need less than 6 rows) */
  131.   display: none;
  132. }
  133.  
  134. /* The footer part -- status bar and "Close" button */
  135.  
  136. .calendar tfoot .footrow { /* The <TR> in footer (only one right now) */
  137.   text-align: center;
  138.   background: #206A9B;
  139.   color: #fff;
  140. }
  141.  
  142. .calendar tfoot .ttip { /* Tooltip (status bar) cell <TD> */
  143.   background: #000;
  144.   color: #fff;
  145.   border-top: 1px solid #206A9B;
  146.   padding: 1px;
  147. }
  148.  
  149. .calendar tfoot .hilite { /* Hover style for buttons in footer */
  150.   background: #B8DAF0;
  151.   border: 1px solid #178AEB;
  152.   color: #000;
  153.   padding: 1px;
  154. }
  155.  
  156. .calendar tfoot .active { /* Active (pressed) style for buttons in footer */
  157.   background: #006AA9;
  158.   padding: 2px 0px 0px 2px;
  159. }
  160.  
  161. /* Combo boxes (menus that display months/years for direct selection) */
  162.  
  163. .calendar .combo {
  164.   position: absolute;
  165.   display: none;
  166.   top: 0px;
  167.   left: 0px;
  168.   width: 4em;
  169.   cursor: default;
  170.   border: 1px solid #655;
  171.   background: #def;
  172.   color: #000;
  173.   font-size: 90%;
  174.   z-index: 100;
  175. }
  176.  
  177. .calendar .combo .label,
  178. .calendar .combo .label-IEfix {
  179.   text-align: center;
  180.   padding: 1px;
  181. }
  182.  
  183. .calendar .combo .label-IEfix {
  184.   width: 4em;
  185. }
  186.  
  187. .calendar .combo .hilite {
  188.   background: #34ABFA;
  189.   border-top: 1px solid #46a;
  190.   border-bottom: 1px solid #46a;
  191.   font-weight: bold;
  192. }
  193.  
  194. .calendar .combo .active {
  195.   border-top: 1px solid #46a;
  196.   border-bottom: 1px solid #46a;
  197.   background: #F1F8FC;
  198.   font-weight: bold;
  199. }
  200.  
  201. .calendar td.time {
  202.   border-top: 1px solid #000;
  203.   padding: 1px 0px;
  204.   text-align: center;
  205.   background-color: #E3F0F9;
  206. }
  207.  
  208. .calendar td.time .hour,
  209. .calendar td.time .minute,
  210. .calendar td.time .ampm {
  211.   padding: 0px 3px 0px 4px;
  212.   border: 1px solid #889;
  213.   font-weight: bold;
  214.   background-color: #F1F8FC;
  215. }
  216.  
  217. .calendar td.time .ampm {
  218.   text-align: center;
  219. }
  220.  
  221. .calendar td.time .colon {
  222.   padding: 0px 2px 0px 3px;
  223.   font-weight: bold;
  224. }
  225.  
  226. .calendar td.time span.hilite {
  227.   border-color: #000;
  228.   background-color: #267DB7;
  229.   color: #fff;
  230. }
  231.  
  232. .calendar td.time span.active {
  233.   border-color: red;
  234.   background-color: #000;
  235.   color: #A5FF00;
  236. }
  237.